<script type="text/javascript">
		$(function(){
			$(document).bind('contextmenu',function(e){
				e.preventDefault();
				$('#mm').menu('show', {
					left: e.pageX,
					top: e.pageY
				});
			});
		});
	</script>

<h2>菜单 - Menu</h2>
<div class="demo-info">
  <div class="demo-tip icon-tip"></div>
  <div> 菜单可以包含许多子菜单,菜单项可以显示子菜单。你也可以右击显示上下文菜单。</div>
</div>
<div style="margin:10px 0"> <a href="#" class="easyui-linkbutton" onclick="javascript:$('#mm').menu('show',{left:100,top:200})">显示菜单</a> <a href="#" class="easyui-linkbutton" onclick="javascript:$('#mm').menu('hide')">隐藏菜单</a> </div>
<div id="mm" class="easyui-menu" style="width:120px;">
  <div onclick="javascript:alert('new')">New</div>
  <div> <span>Open</span>
    <div style="width:150px;">
      <div><b>Word</b></div>
      <div>Excel</div>
      <div>PowerPoint</div>
      <div> <span>M1</span>
        <div style="width:120px;">
          <div>sub1</div>
          <div>sub2</div>
          <div> <span>Sub</span>
            <div style="width:80px;">
              <div onclick="javascript:alert('sub21')">sub21</div>
              <div>sub22</div>
              <div>sub23</div>
            </div>
          </div>
          <div>sub3</div>
        </div>
      </div>
      <div> <span>Window Demos</span>
        <div style="width:120px;">
          <div data-options="href:'window.html'">Window</div>
          <div data-options="href:'dialog.html'">Dialog</div>
          <div><a href="http://www.jeasyui.com" target="_blank">EasyUI</a></div>
        </div>
      </div>
    </div>
  </div>
  <div data-options="iconCls:'icon-save'">Save</div>
  <div data-options="iconCls:'icon-print',disabled:true">Print</div>
  <div class="menu-sep"></div>
  <div>Exit</div>
</div>
<h3>页面代码： </h3>
<pre name="code" class="html">&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
	&lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=UTF-8&quot;&gt;
	&lt;title&gt;Menu - jQuery EasyUI Demo&lt;/title&gt;
	&lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;../themes/default/easyui.css&quot;&gt;
	&lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;../themes/icon.css&quot;&gt;
	&lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;demo.css&quot;&gt;
	&lt;script type=&quot;text/javascript&quot; src=&quot;../jquery-1.7.2.min.js&quot;&gt;&lt;/script&gt;
	&lt;script type=&quot;text/javascript&quot; src=&quot;../jquery.easyui.min.js&quot;&gt;&lt;/script&gt;
	&lt;script type=&quot;text/javascript&quot;&gt;
		$(function(){
			$(document).bind('contextmenu',function(e){
				e.preventDefault();
				$('#mm').menu('show', {
					left: e.pageX,
					top: e.pageY
				});
			});
		});
	&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
	&lt;h2&gt;菜单 - Menu&lt;/h2&gt;
	&lt;div class=&quot;demo-info&quot;&gt;
		&lt;div class=&quot;demo-tip icon-tip&quot;&gt;&lt;/div&gt;
		&lt;div&gt;
			菜单可以包含许多子菜单,菜单项可以显示子菜单。你也可以右击显示上下文菜单。&lt;/div&gt;
	&lt;/div&gt;
	
	&lt;div style=&quot;margin:10px 0&quot;&gt;
		&lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; onclick=&quot;javascript:$('#mm').menu('show',{left:100,top:200})&quot;&gt;显示菜单&lt;/a&gt;
		&lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; onclick=&quot;javascript:$('#mm').menu('hide')&quot;&gt;隐藏菜单&lt;/a&gt;
	&lt;/div&gt;
	&lt;div id=&quot;mm&quot; class=&quot;easyui-menu&quot; style=&quot;width:120px;&quot;&gt;
		&lt;div onclick=&quot;javascript:alert('new')&quot;&gt;New&lt;/div&gt;
		&lt;div&gt;
			&lt;span&gt;Open&lt;/span&gt;
			&lt;div style=&quot;width:150px;&quot;&gt;
				&lt;div&gt;&lt;b&gt;Word&lt;/b&gt;&lt;/div&gt;
				&lt;div&gt;Excel&lt;/div&gt;
				&lt;div&gt;PowerPoint&lt;/div&gt;
				&lt;div&gt;
					&lt;span&gt;M1&lt;/span&gt;
					&lt;div style=&quot;width:120px;&quot;&gt;
						&lt;div&gt;sub1&lt;/div&gt;
						&lt;div&gt;sub2&lt;/div&gt;
						&lt;div&gt;
							&lt;span&gt;Sub&lt;/span&gt;
							&lt;div style=&quot;width:80px;&quot;&gt;
								&lt;div onclick=&quot;javascript:alert('sub21')&quot;&gt;sub21&lt;/div&gt;
								&lt;div&gt;sub22&lt;/div&gt;
								&lt;div&gt;sub23&lt;/div&gt;
							&lt;/div&gt;
						&lt;/div&gt;
						&lt;div&gt;sub3&lt;/div&gt;
					&lt;/div&gt;
				&lt;/div&gt;
				&lt;div&gt;
					&lt;span&gt;Window Demos&lt;/span&gt;
					&lt;div style=&quot;width:120px;&quot;&gt;
						&lt;div data-options=&quot;href:'window.html'&quot;&gt;Window&lt;/div&gt;
						&lt;div data-options=&quot;href:'dialog.html'&quot;&gt;Dialog&lt;/div&gt;
						&lt;div&gt;&lt;a href=&quot;http://www.jeasyui.com&quot; target=&quot;_blank&quot;&gt;EasyUI&lt;/a&gt;&lt;/div&gt;
					&lt;/div&gt;
				&lt;/div&gt;
			&lt;/div&gt;
		&lt;/div&gt;
		&lt;div data-options=&quot;iconCls:'icon-save'&quot;&gt;Save&lt;/div&gt;
		&lt;div data-options=&quot;iconCls:'icon-print',disabled:true&quot;&gt;Print&lt;/div&gt;
		&lt;div class=&quot;menu-sep&quot;&gt;&lt;/div&gt;
		&lt;div&gt;Exit&lt;/div&gt;
	&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;</pre>
<SCRIPT type=text/javascript>
	dp.SyntaxHighlighter.ClipboardSwf = 'documentation/js/clipboard.swf'/*tpa=http://jeasyui.com/SyntaxHighlighter/Scripts/clipboard.swf*/;
	dp.SyntaxHighlighter.HighlightAll('code');
</SCRIPT> 
